{extend name="public:layout" /}

{block name="title"}
	<title>{:site('siteName')}-每日市场奖</title>
{/block}

{block name="css"}
	<link rel="stylesheet" type="text/css" href="__STATIC__/{$theme}/css/user.css">
{/block}

{block name="content"}
	<div class="layui-main">
		<div class="user-main">
			<div class="user-left">
				{include file="public:user" index="0" /}
			</div>
			<div class="user-right">
				<div class="layui-tab layui-tab-brief">
					<ul class="layui-tab-title">
						<li class="layui-this">每日市场奖</li>
					</ul>
					<div class="layui-tab-content">
						<div id="main" style="width: 100%;height: 500px;"></div>
					</div>
				</div> 
			</div>
		</div>
	</div>
{/block}

{block name="script"}
	<script src="__STATIC__/echarts.min.js" type="text/javascript"></script>
	<script type="text/javascript">
		layui.use(['form', 'layer'], function(){
			var $ = layui.jquery;
    		var layer = layui.layer;
    		var data = {$data};
    		console.log(data);
    		var myChart = echarts.init(document.getElementById('main'));
    		var option = {
	            tooltip: {
	            	trigger: 'axis'
	            },
	            xAxis: {
	            	type : 'category',
            		boundaryGap : false,
	                data: data.date
	            },
	            yAxis: {
	            	type: 'value',
			        axisLabel: {
			            formatter: '{value} 元'
			        },
	            	splitNumber: 10
	            },
	            series: [{
	                name: '市场奖',
	                type: 'line',
	                data: data.price
	            }]
	        };

	        // 使用刚指定的配置项和数据显示图表。
	        myChart.setOption(option);
		});
	</script>
{/block}